<template>
	<view class="submitto"  v-if="title === 0">
		<view class="submit-left">
			<image src="@/static/icon/commodity-no.png" v-if="TotalPrice<=0"></image>
			<image src="@/static/icon/commodity.png" v-else></image>
			<view class="submit-price"> 
				<view><text style="font-size: 26rpx;">￥</text>{{TotalPrice.toFixed(2)<=0?0:TotalPrice.toFixed(2)}}</view>
				<text style="font-size: 20rpx;color: #999999;">同城专送 | 可到店自提</text>
			</view>
		</view>
		<view :class="['submit-btn', {'gray-bg': TotalPrice <= 0 }, {'green-bg': TotalPrice > 0 }]"  @click="settlement">去结算</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	export default{
		props:{
			title:{
				type:Number,
				default: 0
			},
			heft:{
				type:Boolean,
				default:false
			},
			form:{
				type:Object,
				default:() => {}
			}
		},
		data(){
			return{
				
			}
		},
		methods:{
			settlement(){ 	
				if(this.TotalPrice > 0){
					if(this.heft){
						this.$bus.$emit('returnobj',this.form)
						uni.navigateBack()
					}else{
						this.$emit('filetr','')
					}
				}
			}
		},
		computed:{
			...mapState(['TotalPrice'])
		}
	}
</script>

<style lang="scss" scoped>
	.submitto{
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 20rpx 40rpx;
		background-color: #fff;
		height: 160rpx;
		.submit-left{
			display: flex;
			align-items: center;
			image{
				width: 120rpx;
				height: 80rpx;
			}
			.submit-price{
				margin-left: 50rpx;
				font-size: 45rpx;
				display: flex;
				flex-direction: column;
				view{
					display: inline-block;
				}
			}
		}
		.submit-btn{
			font-size:30rpx;
			color: #fff;
			text-align: center;
			line-height: 68rpx;
			width: 162rpx;
			height: 7;
			border-radius: 60rpx;
		}
		.green-bg  {
		  background-color: #025E21;
		}
		.gray-bg {
		  background-color:#858585;
		}
	}
</style>